<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <title>Data Transfer to CargoWise</title>
    <link rel="icon" type="image/png" href="images/favicon.png">
    <link href="css/bootstrap5.min.css" rel="stylesheet"/>
    <link href="css/fontello.css" rel="stylesheet">
    <link href="css/index.css" rel="stylesheet"/>
</head>
<body>
<div class="page-container">
    <header class="banner">
        <div class="float-start"> Data Transfer to CargoWise</div>
        <div id="userCap" class="float-end rounded-circle bg-primary text-white d-flex align-items-center justify-content-center fw-bold"
             style="width:60px; height:60px; font-size:20px;">
            A
        </div>
        <div style="float: right" >
            <label>Font size:<select id="desktopSize" style="width: auto" class="form-select form-select-sm border-0">
                <option value="20px">Large</option>
                <option value="16px">Medium</option>
                <option value="14px" selected>Recommend</option>
                <option value="12px">Small</option>
            </select>
            </label>
        </div>
    </header>

    <main class="content">
        <div class="bg-light border-end p-0" style="width: 4rem;" id="iconMenu">
            <nav class="nav flex-column text-center">
            </nav>
        </div>
        <nav class="menu" id="menu" tabindex="0" aria-label="Main menu">
            <!-- Menu will be generated here -->
            <ul class="nav flex-column">
            </ul>
        </nav>
        <div class="resizer" id="resizer" aria-label="Resize menu" role="separator" tabindex="0"></div>
        <section class="workspace" tabindex="0">
            <iframe id="desktop" name="desktop" src="mainframe.html" style="overflow: hidden">
            </iframe>
        </section>
    </main>

    <footer class="footer">
        &copy; 2025 IGH. All rights reserved.
    </footer>
</div>

<script src="js/common.js"></script>
<script src="js/index.js"></script>
</body>
</html>
